<template>
  <div class="home">
    <Homeheader></Homeheader>
    <home-swiper :swiperList="list"></home-swiper>
    <home-icon :iconList="iconList"></home-icon>
    <home-tion></home-tion>
    <home-hot></home-hot>
    <home-like></home-like>
    <home-weekend></home-weekend>
  </div>
</template>
<script>
  // import BScroll from 'better-scroll'
  import Homeheader from './pages/Header'
  import HomeSwiper from './pages/swiper'
  import HomeIcon from './pages/icon'
  import HomeTion from './pages/location'
  import HomeHot from './pages/hot'
  import HomeLike from './pages/like'
  import HomeWeekend from './pages/weekend'
  import {mapState} from 'vuex'
  export default {
    data(){
      return {
        list:[],
        iconList:[],
        citys:""
      }
    },
    components:{
      Homeheader,
      HomeSwiper,
      HomeIcon,
      HomeTion,
      HomeHot,
      HomeLike,
      HomeWeekend
    },
    computed:{
      ...mapState(['city'])
    },
    methods:{
      getHttp(){
        this.$http.get("/api/data/homedata.json").then((res)=>{
          // console.log(res.data.data);
          let data = res.data.data;
          data.forEach((itm,index)=>{
            if(itm.city == this.city){
              this.list = itm.list;
              this.iconList = itm.icon_list;
            }
          });
          // console.log(this.list)
        });
      }
    },
    mounted(){
      this.getHttp();
      this.citys = this.city;
    },
    activated(){
     if(this.citys != this.city){
       this.getHttp();
       this.citys = this.city;
     }
    }
  }

</script>
<style>
  .home{
    background: #f5f5f5;
  }
  /*.container{*/
    /*position: absolute;*/
    /*top:.44rem;*/
    /*left: 0;*/
    /*right: 0;*/
    /*bottom: 0;*/
  /*}*/
</style>
